$(function(){

    // 导航卡点击事件
    $(".gg").on('mouseout', function () {
        $(".b").slideDown();
    })
    $(".gg").on('mouseleave', function () {
        $(".b").slideUp("fast");
    })

    $(".gh").on('mouseout', function () {
        $(".lm").slideDown();
    })
    $(".gh").on('mouseleave', function () {
        $(".lm").slideUp("fast");
    })

    $(".gj").on('mouseout', function () {
        $(".e").slideDown();
    })
    $(".gj").on('mouseleave', function () {
        $(".e").slideUp("fast");
    })
    
    //导航栏点击事件结束


    //调用get方法
        //传的实参,没有参数是null,这个function可以带来实参，是响应对象
    var num = 3;
    // var t=
        $('#button').on("click",function(){
            // 
            $.get("./页面.json", null, function (req) {
                
                for (var i = 0; i < num+3; i++) {
                   
                    //模板引擎方法
                    
                    $("#t").append( `
                    <div class="uu">

                    <div class="s">
                         <span class="mn">${req[i].profession}</span>
                         <span class="mb">${req[i].address}</span>
                         <span class="mv">${req[i].way}</span>
                    </div>
                    <div class="w">
                        <span class="mc">${req[i].experience}</span>
                        <span class="mx">${req[i].education}</span>
                    </div>
                    <span class="ff">
                        <img src="${req[i].img}" alt="">
                        <p>${req[i].name}</p>
            
                    </span>

                    <div class="v">
                         <span class="kp">${req[i].group}</span>
                         <span class="kp">${req[i].job}</span>
                         <span class="kp">${req[i].money}</span>
                    </div>
                    
                    
                  </div>
        
                `)
                }
              

            })
        })
  
})

